
<!doctype html>
<html>
<head>
    <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta charset="utf-8">
    <title>购物车</title>
    <link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="../css/shop/shopcart.css">
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css">
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <link rel="stylesheet" href="../css/shop/myshow.css">
    <script>
        jQuery.ajaxSettings.traditional = true;
        var userStr = sessionStorage.getItem("user");
        var userId;
        var myIntegral;
        if(userStr){
            userId=JSON.parse(userStr).id
            //商城回显用户积分
            $.get("/integral/"+userId,function (data) {
                if(data){
                    myIntegral = data.count;
                }
            })
        }
        $(function () {
            var countStr = sessionStorage.getItem("cartNum")
               var count= JSON.parse(countStr);
                if(count>0){
                $.get("/product/cart",function (data) {
                    console.log(data);
                    var product="";
                    $.each(data,function (index,ele) {
                        product+='<div class="goods_boxs">' +
                            '    <input class="checkbox_child fl" type="checkbox" data-json='+ele.jsonString+'>' +
                            '    <img class="fl" src="'+ele.img+'" alt="">' +
                            '    <div class="goods_parameter fl">' +
                            '        <p style="">'+ele.name+'</p>' +
                            '        <span>类别：'+ele.productType.name+'</span>' +
                            '        <div><i class="color_rgba fl">积分</i><i class="c_unitprice fl">'+ele.salePrice+'</i><i class="the_number_of fr productNum">X1</i></div>' +
                            '    </div>' +
                            '    <div class="goods_delete fr" data-id="'+ele.id+'">删除</div>' +
                            '    <br style="clear:both;">' +
                            '</div>'
                    })
                    $(".cheackAll").after(product);
                    //删除按钮事件,下雨天删除session
                    $('.goods_delete').on("click",function() {
                        var s = $('.goods_delete').index(this);
                        $('.goods_boxs').eq(s).remove();
                        var id = $(this).data('id')
                        $.ajax({
                            url:'/product/cart',
                            type:"DELETE",
                            data:{id:id},
                            success:function (data) {
                                if(data.success){
                                    //回显购物车数据
                                    var size = data.data.length
                                    sessionStorage.setItem("cartNum", JSON.stringify(size));
                                    $(document).dialog({
                                        type : 'toast',
                                        infoIcon: '../img/icon/success.png',
                                        infoText: '成功',
                                        autoClose: 1000
                                    });
                                }else{
                                    $(document).dialog({
                                        type : 'toast',
                                        infoIcon: '../img/icon/fail.png',
                                        infoText:data.msg,
                                        autoClose: 1000
                                    });
                                }
                                }
                        })
                        // // 点击删除计算去结算个数
                        // var childL = $('.checkbox_child:checked').length;
                        // $('.number_geshu').text(childL);
                        // 重新计算价格
                        unitprice_zong = 0;
                        if ($('.goods_boxs').length > 0) {
                            $('.checkbox_child').each(function() {
                                if ($(this).is(':checked')) {
                                    var zzyxx = parseInt($(this).parent().find('.goods_parameter').find('div').find('.c_unitprice').text());
                                    unitprice_zong += zzyxx;
                                }
                                $('.jianqiangzong').text(unitprice_zong);
                            })
                        } else {
                            unitprice_zong = 0;
                            $('.jianqiangzong').text(unitprice_zong);
                            $('.checkbox_all').prop('checked', false);
                        }

                    })
                })
                //函数
                $(".settlement_a").on("click",function () {
                    //获取选中的id
                    var params = $.map($(".checkbox_child:checked"),function (ele) {
                         var json = $(ele).data("json")
                        // var param = {'user.id':userId,'product.id':json.id,'price':json.salePrice};
                        var param = {'user':{'id':userId},'product':{'id':json.id},'price':json.salePrice};
                        return param;
                    })
                    console.log(params);
                    //后台结算购物车
                        $.ajax({
                            url: '/orderList/cart' ,
                            type: "POST",
                            data: JSON.stringify(params),
                            contentType: "application/json",
                            success: function (data) {
                                var cartNum = sessionStorage.getItem("cartNum")
                                cartNum = JSON.parse(cartNum)-params.length
                                console.log(params.length);
                                sessionStorage.setItem("cartNum", JSON.stringify(cartNum));
                                $(document).dialog({
                                    titleText: '温馨提示',
                                    type: 'confirm',
                                    closeBtnShow: true,
                                    content: '结算成功,去我的物品查看',
                                    onClickConfirmBtn: function () {
                                        window.location.href = "/mine/packsack.html";
                                    },
                                    onClickCancelBtn : function(){
                                        window.location.reload()
                                    },
                                    onClickCloseBtn  : function(){
                                        window.location.reload()
                                    }
                                });
                            }
                        });
                })}
        })

    </script>
</head>
<body id="tbody">
<div class="search-head">
    <div class="row nav-search">
        <div class="col-5">
            <a href="/mine/product.html">
                <span><i class="fa fa-chevron-left fa-2x"></i></span>
            </a>

        </div>
        <span style="text-align: center">积分商城</span>
    </div>
</div>
<div class="generations_box cheackAll">
    <input class="checkbox_all fl" type="checkbox"><span class="fl">全选</span><span class="the_editor fr">编辑</span>
</div>
<!--商品栏-->
<div class="A_total_of">
    <div class="settlement_a fr">去结算</div>
    <div class="fr">
        总计：<span style="color:rgba(232,170,59,1);">￥</span><span class="jianqiangzong" style="color:rgba(232,170,59,1);">0.0</span>
    </div>
</div>

<script>
    $(window).ready(function() {

        // 显示隐藏删除按钮
        var delete_value = true;
        $('.the_editor').click(function() {
            if (delete_value) {
                $('.goods_delete').animate({
                    right: 0
                }, 200);
                delete_value = false;
            } else {
                $('.goods_delete').animate({
                    right: '-50px'
                }, 200);
                delete_value = true;
            }
        })

        // 删除按钮删除本身nei


        // 一键全选/全不选
        // .prop("checked", true);
        var unitprice_zong = 0; //总价
        var childL = 0; //个数
        $('.checkbox_all').click(function() {
            if ($(this).is(":checked")) {
                // 全选
                $('.checkbox_child').prop("checked", true);
                // 全选改变结算背景色
                $('.settlement_a').css('background', 'red');
                // // 总个数
                // childL = $('.checkbox_child').length;
                // $('.number_geshu').text(childL);
                // 计算总价
                unitprice_zong = 0;
                $('.checkbox_child').each(function() {
                    var hh = parseInt($(this).parent().find('.goods_parameter').find('div').find('.c_unitprice').text());
                    unitprice_zong += hh;
                })
                $('.jianqiangzong').text(unitprice_zong);

            } else {
                // 全不选
                $('.checkbox_child').prop("checked", false);
                // 按钮变色
                $('.settlement_a').css('background', 'rgba(232,170,59,1)');
                // 总个数
                // childL = 0;
                // $('.number_geshu').text(childL);
                // 计算总价
                unitprice_zong = 0;
                $('.jianqiangzong').text(unitprice_zong);
            }
        })

        var all_btn = 0; //被打勾的复选框个数
        //点击子按钮事件
        $("#tbody").on("click",".checkbox_child",(function() {
            // 按钮变色
            if ($('.checkbox_child').is(':checked')) {
                $('.settlement_a').css('background', 'red');
            } else {
                // 按钮变色
                $('.settlement_a').css('background', 'rgba(232,170,59,1)');
            }

            // 少一个不全选 全在就群选
            var chang_child = $('.checkbox_child').length;
            $('.checkbox_child').each(function() {
                if ($(this).is(':checked')) {
                    all_btn++;
                } else {
                    all_btn--;
                }
            })
            // 6666666666666666666666666
            if (all_btn == chang_child) {
                $('.checkbox_all').prop('checked', true);
                all_btn = 0;
            } else {
                $('.checkbox_all').prop('checked', false);
                all_btn = 0;
            }

            //点击是从新计算总价
            unitprice_zong = 0;
            $('.checkbox_child').each(function() {
                if ($(this).is(':checked')) {
                    var zzxx = parseInt($(this).parent().find('.goods_parameter').find('div').find('.c_unitprice').text());
                    unitprice_zong += zzxx;
                }
                $('.jianqiangzong').text(unitprice_zong);
            })
        })
        )

    })
</script>

</body>
</html>
